<template>
  <div class="search">
    <f-form ref="form" :action="api.avmVideo" :form-key="this.formItem.videoId" :file-ids="fileIds">
      <f-form-item label="标题" name="videoTitle" :required="true" :value="formItem.videoTitle"/>
      <f-form-item label="标签" type="tag" name="videoTag" :value="formItem.videoTag"></f-form-item>
      <f-form-item label="发布地址" name="sendAddress"  :value="formItem.sendAddress"/>
      <f-form-item label="封面图" type="upload" name="coverImage" :value="formItem.coverImage" :file-max="1" @uploadSuccess="uploadSuccess"/>
      <f-form-item label="商品视频" type="video" name="videoUrl" :value.sync="formItem.videoUrl" @uploadSuccess="uploadVideoSuccess"/>
    </f-form>
  </div>
</template>

<script>
  export default {
    name: 'videoForm',
    props: {},
    data() {
      return {
        isAdd: true,//是否是添加模式
        loaded: false,//是否加载轮播图组件
        fileIds: [],//上传文件ID
        formItem: this.getFormItem()
      }
    },
    methods: {
      getFormItem() {
        return {
          videoId: '',
          videoTitle: '',
          videoTag:'',
          sendAddress:'',
          videoUrl: '',
          ossUrl: '',
          coverImage: '',
          videoState: ''
        }
      },
      //表单赋值
      setData(data) {
        this.$refs.form.resetFields()
        this.formItem = this.getFormItem()
        this.isAdd = true
        if (data && data.videoId) {
          this.$refs.form.getDetails({ videoId: data.videoId }, (data) => {
            this.formItem = data
            this.loaded = true
          })
          this.isAdd = false
        } else {
          this.loaded = true
        }
      },
      //文件上传回调
      uploadSuccess(fileIds, files) {
        this.fileIds = fileIds
      },
      //提交表单
      handleSubmit(callback) {
        this.$refs.form.submit({},callback)
      },
      //视频上传回调
      uploadVideoSuccess(fileUrl, file, fileId, removeIds) {
        this.formItem.videoUrl = fileUrl
      }
    },
    created() {

    },
    components: {}
  }
</script>

<style scoped lang="less" rel="stylesheet/less">

</style>
